<template>
    <div class="page">
        <div class="data-item block">
            <div class="title">报价人</div>
            <div class="content">
                <div class="item text-gray">发布人</div>
                <div class="item text-black right-text">黄文君(桐城农商行)</div>
            </div>
            <div class="content">
                <div class="item text-gray">办公电话</div>
                <div class="item text-blue right-text">0755-82786009</div>
            </div>
            <div class="content">
                <div class="item text-gray">联系电话</div>
                <div class="item text-blue right-text">17704021318</div>
            </div>
            <div class="content">
                <div class="item text-gray">联系邮箱</div>
                <div class="item text-blue right-text">service@djs18.com</div>
            </div>
            <div class="content">
                <div class="item text-gray">QQ/微信</div>
                <div class="item text-black right-text">17704021318</div>
            </div>
        </div>
        <div class="data-item block">
            <div class="title">报价内容</div>
            <div class="content none-padding">
                <div class="item-content item">
                    <div class="item text-gray">方向</div>
                    <div class="item text-black right-text">融出</div>
                </div>
                <div class="item-content item">
                    <div class="item text-gray">模式</div>
                    <div class="item text-black right-text">押上清</div>
                </div>
            </div>
            <div class="content none-padding">
                <div class="item-content item">
                    <div class="item text-gray">对手</div>
                    <div class="item text-black right-text">限银行</div>
                </div>
                <div class="item-content item">
                    <div class="item text-gray">期限</div>
                    <div class="item text-black right-text">隔夜</div>
                </div>
            </div>
            <div class="content none-padding">
                <div class="item-content item">
                    <div class="item text-gray">利率</div>
                    <div class="item text-black right-text">5.9%</div>
                </div>
                <div class="item-content item">
                    <div class="item text-gray">金额</div>
                    <div class="item text-black right-text">20亿</div>
                </div>
            </div>
        </div>
        <div class="data-item block">
            <div class="title">报价原文</div>
            <div class="content">
                <div class="item text-black">出 1-6个月 押利率亿亿 杨阳 卫辉农信出 1-6个月 押利率 1亿 杨阳 卫辉农信社社 0373-4486680 </div>
            </div>
            <div class="date text-gray">发布时间：2018.04.10 22:20</div>
        </div>
        <min-title-bar title="热门评论"/>
        <user-comment v-for="(item, key) in comment" :key="'comment' + key" :data="item"/>
        <see-more-btn/>
        <div class="bg-color">
            <bottom-logo/>
        </div>
        <release-comment/>
    </div>
</template>

<style lang="less" scoped>

    @import '../../style/variable';

    .page{

        padding-bottom: 5rem;

        .block{
            border-top: .8rem solid @color-bg-gray;
        }


        .data-item{
            padding: 1.5rem 0;

            .title{
                font-size: 1.6rem;
                line-height: 2.7rem;
                padding: 0 1.5rem;
            }
            .content{
                display: flex;
                justify-content: space-between;
                margin-top: .7rem;
                padding: 0 1.5rem;
                &.none-padding{
                    padding: 0;
                }
                .item-content{
                    display: flex;
                    justify-content: space-between;
                    padding: 0 1.5rem;
                }

                .item{
                    flex: 1;
                    font-size: 1.5rem;
                    line-height: 2.1rem;
                }
                .left-text{
                    text-align: left;
                }
                .right-text{
                    text-align: right;
                }
            }

            .date{
                font-size: 1.2rem;
                line-height: 1.7rem;
                margin-top: 1rem;
                padding: 0 1.5rem;
            }

        }
        .bg-color{
            background-color: @color-bg-gray;
        }
    }

</style>

<script>
    export default {
        data (){
            const comment = Array(2).fill({
                src: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1958966202,1289193182&fm=27&gp=0.jpg',
                name: '中国证券报',
                date: '2018.03.01 18:22',
                content: '日本总务省周五公布的数据显示，1月份失业率降至为1993年4月份以来最低水平'
            });
            return {comment}
        },
        methods: {
        },
        created(){
            this.$store.commit('hideNav', true);
        }
    }
</script>